<template>
	<view>
		<view class="status_bar"></view>

		<!-- 自定义顶部导航栏 -->
		<view class="h90 themeBac cwhite f-c-c">
			<image @click="$back(1)" class="backIcon" src="../../static/login/icon_back.png" mode="widthFix"></image>
			{{title}}
		</view>

		<!-- 内容 -->
		<!-- 推荐展示 -->
		<view class="recommend">
			<u-empty v-show="show" text="暂无数据" mode="list"></u-empty>
			<view class="recommend-item f30 cwhite" v-for="(item,index) in recommendList" :key="index"
				@click="item.type==='1'?$to(`../looking-for-goods/looking-for-goods?id=${item.id}&isMe=false&status=寻找失主`):$to(`../looking-for-goods/looking-for-goods?id=${item.id}&isMe=false&status=赏金`)">
				<image :src="baseUrl+item.coverimg" mode=""></image>
				<view class="">{{item.title}}</view>
				<text style="margin-right: 30rpx;">{{item.type==1?'寻找失主':'赏金'}}</text>
				<text>{{item.goodstype.name}}</text>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				baseUrl: this.$u.baseUrl,
				title: "",
				/* 推荐展示列表 */
				recommendList: [],
				show:false
			}
		},
		onLoad(e) {
			console.log(e);
			this.title = e.name||e.value
			e.id === undefined ? '' : this.findGoodByType(e.id)
			e.value === undefined ? '' : this.findGoods(e.value)
		},
		methods: {
			async findGoodByType(id) {
				const res = await this.$u.api.findGoodByType({
					id
				})
				console.log(res);
				this.recommendList = res.data
				!res.success?this.show=true:this.show=false
			},
			async findGoods(search) {
				const res = await this.$u.api.findGoods({
					search
				})
				console.log(res);
				this.recommendList = res.data
				!res.success?this.show=true:this.show=false
			}
		}
	}
</script>

<style>
	.backIcon {
		position: absolute;
		left: 20rpx;
		width: 20rpx;
	}

	.recommend {
		display: flex;
		flex-wrap: wrap;
		margin: 10rpx 0;
		justify-content: space-between;
		padding: 25rpx;
	}

	.recommend-item {
		width: 331rpx;
		background-color: #707070;
		border-radius: 15rpx;
		margin-bottom: 20rpx;
		padding: 0 5rpx;
		padding-bottom: 10rpx;
	}

	.recommend-item image {
		width: 100%;
		height: 291rpx;
		border-radius: 15rpx;
	}
	.u-empty{
		position: relative;
		margin-top: 100rpx!important;
		left: 50%;
		margin-left: -60rpx;
	}
</style>
